<!DOCTYPE html>

<!--@author:Cao Tongqin and Zhang Jianfeng-->

<html>

<head>
    <title>详细信息</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="../css/head.css">
    <link rel="stylesheet" type="text/css" href="novelInfomation.css">
    <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="../../vue.min.js"></script>
    <script type="text/javascript" src="novelInfomation.js"></script>
</head>

<body>
    <div id='top'>
        <div>
            <div onclick="location='../home/index.html'">
                <img src='../logo.png'>
                <a>黑眼圈小说网</a>
            </div>
            <div>
                <input id='ipt' placeholder='书名、作者' />
                <div id="btn">
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                </div>
            </div>
            <a href="https://www.bilibili.com">登录/注册</a>
        </div>
    </div>
    <div id='main'>
        <div id='dtl'>
            <a id='name'>{{novinf.bookName}}</a>
            <div>
                <div id='info'>
                    <img src='https://img3.doubanio.com/view/subject/l/public/s33602160.jpg'>
                    <div>
                        <div>作者：<a id='author' onclick="findBooksOfAuthor(this)">{{novinf.author}}</a></div>
                        <div>出版社：<a>{{novinf.publisher}}</a></div>
                        <div>状态：<a>{{novinf.state}}</a></div>
                        <div>类型：<a>{{novinf.type}}</a></div>
                    </div>
                </div>
                <div id='score'>
                    <a>豆瓣评分</a>
                    <div>
                        <a>{{novinf.score}}</a>
                        <div>
                            <div></div>
                            <a>132人评价</a>
                        </div>
                    </div>
                    <div v-for="(starl,index) in starls":key="index">
                        <a>{{starl.name}}</a>
                        <div style="width:0px"  :id="starId('starlevel_',index)"></div>
                        <a>{{starl.ratio}}%</a>
                    </div>>-->
                </div>
            </div>
            <div>
                <button id="recommend" onclick="buttonDown(this)">推荐</button>
                <button id="read" onclick="buttonDown(this)">读过</button>
                <a>评价：</a>
                <div id=''>
                    <img src='../star0.png' id="star_1" onclick="star_evaluate(this)">
                    <img src='../star0.png' id="star_2" onclick="star_evaluate(this)">
                    <img src='../star0.png' id="star_3" onclick="star_evaluate(this)">
                    <img src='../star0.png' id="star_4" onclick="star_evaluate(this)">
                    <img src='../star0.png' id="star_5" onclick="star_evaluate(this)">
                </div>
                <a onclick="scrollToComments(this)" id="comments">写书评</a>

            </div>
            <a>内容简介</a>
            <p>{{novinf.description}}</p>
            <p></p>
            <a>短评</a>
            <div v-for="(com,index) in coms":key="index" class="com">
                <div>
                    <a>{{com.name}}</a>
                    <img src='' :id="nameId(index,1)">
                    <img src='' :id="nameId(index,2)">
                    <img src='' :id="nameId(index,3)">
                    <img src='' :id="nameId(index,4)">
                    <img src='' :id="nameId(index,5)">
                </div>
                <p>{{com.discuss}}</p>
            </div>
            <textarea cols="30" rows="10" maxlength="300" name="comment" placeholder="请输入短评，最大数字不超过300" id="textarea" onkeyup="wordCount(this)"></textarea>
            <div><button onclick="submitComments()">提交</button><p><span id="word_count">0</span>/300</p></div>
        </div>
        <div id="rec">
            <a>喜欢这本书的人还喜欢：</a>
            <div v-for="(ol,index) in lother":key="index">
                <img src={{ol.img}}>
                <div>
                    <a>{{ol.name}}</a>
                    <a>类型：{{ol.type}}</a>
                    <a>作者：{{ol.author}}</a>
                </div>
            </div>
        </div>
    </div>
</body>